.python-selector {
  display: block;
  position: relative;
}

.python-selector-list {
  display: flex;
  flex-direction: column;
}

.python-selector-item {
  margin: 8px 8px 4px;
  display: flex;
  flex: 0 0;
  height: 100px;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  align-content: center;
  background-color: #bbbbbb;
  border-radius: 6px;
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
  border: #adadad;
  transition: all 0.2s;
}

.python-selector-item:hover {
  background-color: lightgray;
}

.python-selector-item header {
  flex: 0 0 150px;
  margin: 20px;
}

.python-selector-item footer {
  flex: 0 0 100px;
  align-self: center;
  margin-left: 10px;
}

.python-selector-item .description {
  flex: 1 0 150px;
  display: flex;
  flex-direction: column;
  padding: 10px;
  white-space: nowrap;
  font-size: 8px;
}

.python-selector-item .description .cmd {
  font-size: 18px;
  margin-bottom: 5px;
}

.python-selector-item .code-value {
  font-family: Menlo, Monaco, 'Andale Mono', 'Lucida Console', 'Courier New', monospace
}

.python-selector-item .version {
  display: inline-block;
  white-space: normal;
  vertical-align: text-top;
  font-size: 8px;
}

.python-selector-item .packages-on-display {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex: 1 1 50px;
  justify-content: center;
  align-items: center;
  align-content: stretch;
}
.python-selector-item .packages-on-display > * {
  flex: 1 1 80px;
  margin: 5px;
  height: 40px;
  max-width: 120px;
}

.python-selector .logo-python {
  background: no-repeat center/contain url(logo-python.svg);
}

.python-selector .logo-anaconda {
  background: no-repeat center/contain url(logo-anaconda.svg);
}

/* @see https://github.com/pydata/pandas/tree/master/doc/logo */
.python-selector .logo-pandas {
  background: no-repeat center/contain url(logo-pandas.svg);
}

/* @see https://github.com/matplotlib/matplotlib/blob/master/doc/_static/logo2.svg */
.python-selector .logo-matplotlib {
  background: no-repeat center/contain url(logo-matplotlib.svg);
}

/* @see https://github.com/PyTables/PyTables/tree/master/doc/source/images */
.python-selector .logo-pytables {
  background: no-repeat center/contain url(logo-pytables.svg);
}

/* @see https://github.com/numpy/numpy/blob/master/branding/icons/ */
.python-selector .logo-numpy {
  background: no-repeat center/contain url(logo-numpy.svg);
}
